import 'dart:math';

import 'package:flutter/material.dart';

class ResultDetailPage extends StatefulWidget {
  const ResultDetailPage({super.key});

  @override
  State<ResultDetailPage> createState() => _ResultDetailPageState();
}

class _ResultDetailPageState extends State<ResultDetailPage> {
  Color _titleColor = Color.fromRGBO(0, 55, 100, 1);

  @override
  Widget build(BuildContext context) {
    double scrW = MediaQuery.of(context).size.width;

    return Scaffold(
      appBar: AppBar(
        elevation: 0,
        foregroundColor: _titleColor,
        backgroundColor: Colors.white,
        actions: const [
          Center(
              child: Text(
            'Result',
            style: TextStyle(color: Colors.black),
          )),
          SizedBox(
            width: 20,
          )
        ],
      ),
      body: ListView(
        children: [
          Container(
            height: 200,
            color: Theme.of(context).primaryColor,
            child: Column(
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              children: [
                Image(
                  width: 150,
                  image: AssetImage('images/banzi.png'),
                ),
                Text(
                  'Korea',
                  style: TextStyle(
                      color: _titleColor,
                      fontSize: 24,
                      fontWeight: FontWeight.w800),
                )
              ],
            ),
          ),
          Container(
            child: Column(
              children: [
                Container(
                  margin: EdgeInsets.symmetric(horizontal: 20, vertical: 10),
                  child: const Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Image(height: 40, image: AssetImage('images/gold.png')),
                      Text(
                        'Gold Medals',
                        style: TextStyle(
                            color: Color(0xFFFAC67C),
                            fontWeight: FontWeight.w800,
                            fontSize: 16),
                      )
                    ],
                  ),
                ),
                Container(
                  margin: const EdgeInsets.only(left: 15),
                  child: SingleChildScrollView(
                    scrollDirection: Axis.horizontal,
                    child: Row(
                      children: [
                        people(scrW),
                        SizedBox(
                          width: 10,
                        ),
                        people(scrW),
                        SizedBox(
                          width: 10,
                        ),
                        people(scrW),
                        SizedBox(
                          width: 10,
                        ),
                        people(scrW),
                      ],
                    ),
                  ),
                )
              ],
            ),
          ),
          Container(
            child: Column(
              children: [
                Container(
                  margin: EdgeInsets.symmetric(horizontal: 20, vertical: 10),
                  child: const Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Image(
                          height: 40, image: AssetImage('images/silver2.png')),
                      Text(
                        'Silver Medals',
                        style: TextStyle(
                            color: Color(0xFF99C2EF),
                            fontWeight: FontWeight.w800,
                            fontSize: 16),
                      )
                    ],
                  ),
                ),
                Container(
                  margin: const EdgeInsets.only(left: 15),
                  child: SingleChildScrollView(
                    scrollDirection: Axis.horizontal,
                    child: Row(
                      children: [
                        people(scrW),
                        SizedBox(
                          width: 10,
                        ),
                        people(scrW),
                        SizedBox(
                          width: 10,
                        ),
                        people(scrW),
                        SizedBox(
                          width: 10,
                        ),
                        people(scrW),
                      ],
                    ),
                  ),
                )
              ],
            ),
          ),
          Container(
            child: Column(
              children: [
                Container(
                  margin: EdgeInsets.symmetric(horizontal: 20, vertical: 10),
                  child: const Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Image(height: 40, image: AssetImage('images/bronze.png')),
                      Text(
                        'Bronze Medals',
                        style: TextStyle(
                            color: Color(0xFFD98857),
                            fontWeight: FontWeight.w800,
                            fontSize: 16),
                      )
                    ],
                  ),
                ),
                Container(
                  margin: const EdgeInsets.only(left: 15),
                  child: SingleChildScrollView(
                    scrollDirection: Axis.horizontal,
                    child: Row(
                      children: [
                        people(scrW),
                        SizedBox(
                          width: 10,
                        ),
                        people(scrW),
                        SizedBox(
                          width: 10,
                        ),
                        people(scrW),
                        SizedBox(
                          width: 10,
                        ),
                        people(scrW),
                      ],
                    ),
                  ),
                )
              ],
            ),
          ),
        ],
      ),
    );
  }

  Container people(double scrW) {
    return Container(
      width: (scrW - 50) / 2,
      height: (scrW - 50) / 2 / 4 * 5,
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(15),
        color: Theme.of(context).primaryColor,
      ),
      child: Container(
        margin: EdgeInsets.all(10),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Container(
              height: (scrW - 50) / 2 - 20,
              width: (scrW - 50) / 2 - 20,
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(15),
                color: Theme.of(context).primaryColor,
              ),
              child: Image(
                height: (scrW - 50) / 2 - 60,
                image: const AssetImage('images/man.png'),
              ),
            ),
            Column(
              children: [
                Container(
                    alignment: Alignment.centerLeft,
                    child: const Text(
                      'Theodore Shankles',
                      style: TextStyle(fontSize: 16),
                    )),
                Container(
                  alignment: Alignment.centerLeft,
                  child: const Text(
                    'Plumbing and Heating',
                    style: TextStyle(fontSize: 16, color: Color(0xFF999999)),
                  ),
                )
              ],
            )
          ],
        ),
      ),
    );
  }
}
